<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <link th:href="@{/css/bootstrap.css}" rel="stylesheet" type="text/css" />
    <script type="text/javascript" th:src="@{/js/bootstrap.js}"></script>
    <script type="text/javascript" th:src="@{/js/jquery.min.js}"></script>
    <meta charset="UTF-8">
    <title>添加违法记录</title>
</head>
<script type="text/javascript">
    $(function () {

        username();
        behavior();
    });
    // 下拉选框姓名
    function username() {

        $.ajax({
            dataType:"json",
            type:"post",
            contentType: "application/json;charset=utf-8",
            async:true,
            url:"showuser",
            success:function (data) {
                console.log(data);
                $.each(data,function(index,item){
                    console.log(item.userName);
                    $("#userName").append('<option id = "'+userName+'" name="userName"  value="'+ item.userName+'">'+ item.userName+'</option>');
                });
            },
            error:function () {
                alert("sda")
            }
        })
    }
    //通过姓名二级联动车牌号跟手机号
    function select(user) {
        var selectedIndex = user.selectedIndex;
        console.log(selectedIndex);
        $.ajax({
            dataType:"json",
            type:"post",
            contentType: "application/json;charset=utf-8",
            async:true,
            url:"showrecord",
            success:function (data) {
               var carnumber = data[selectedIndex].carNumber;
                console.log(carnumber);
                var tel = data[selectedIndex].user.tel;
                console.log(tel);
                $("#carNumber").attr("value",carnumber);
                $("#tel").attr("value",tel);
            }
        })
    }
    //下拉选框违法行为
    function behavior() {

        $.ajax({
            dataType:"json",
            type:"post",
            contentType: "application/json;charset=utf-8",
            async:true,
            url:"showitem",
            success:function (data) {
                $.each(data,function(index,item){
                    console.log(item.illegalBehavior);
                    $("#illegalBehavior").append('<option id = "'+illegalBehavior+'" value="'+ item.illegalBehavior+'">'+ item.illegalBehavior+'</option>');
                });
            },
            error:function () {
                alert("sda")
            }
        })
    }
    //通过姓名二级联动违法编号跟罚款金额
    function selectbehave(itemss) {
        var selectedIndex = itemss.selectedIndex;
        console.log(selectedIndex);
        $.ajax({
            dataType:"json",
            type:"post",
            contentType: "application/json;charset=utf-8",
            async:true,
            url:"showrecord",
            success:function (data) {
                var illegalnumber = data[selectedIndex].item.illegalNumber;
                console.log(illegalnumber);
                var penalty = data[selectedIndex].item.penalty;
                console.log(penalty);
                var score = data[selectedIndex].item.score;
                console.log(score);
                $("#illegalNumber").attr("value",illegalnumber);
                $("#penalty").attr("value",penalty);
                $("#score").attr("value",score);
            }
        })
    }


</script>

<body>
<h1 style="font-weight: bolder">添加违法记录</h1>
<form class="form-horizontal"  method="post" action="addRecord" >
    <div class="form-group">
        <label  class="col-sm-2 control-label">违法时间</label>
        <div class="col-sm-10" >
            <input type="text" class="form-control"  name="illegalTime" id="illegalTime" readonly="true" required="required">
        </div>
    </div>
    <script  type="text/javascript">
        var now = new Date();
        var time = now.getFullYear() + '-' + (now.getMonth() + 1) + '-' + now.getDate()+' '+now.getHours()+':'+now.getMinutes()+':'+now.getSeconds();
        $("#illegalTime").attr("value",time);
    </script>
    <div class="form-group">
        <label  class="col-sm-2 control-label">车主姓名</label>
        <div class="col-sm-10">
            <select id="userName"  name="userName" class="form-control" onchange="select(this)">
            </select>
        </div>
    </div>
    <div class="form-group">
        <label  class="col-sm-2 control-label">车牌号</label>
        <div class="col-sm-10">
            <input type="text" class="form-control" name="carNumber" readonly="true" id="carNumber" >
        </div>
    </div>
    <div class="form-group">
        <label  class="col-sm-2 control-label">手机号码</label>
        <div class="col-sm-10">
            <input type="text" class="form-control" name="tel" id="tel" placeholder="手机号码" readonly="true">
        </div>
    </div>
    <div class="form-group">
        <label  class="col-sm-2 control-label">违法行为</label>
        <div class="col-sm-10">
            <select id="illegalBehavior" name="illegalBehavior" class="form-control" onchange="selectbehave(this)">
            </select>
        </div>
    </div>
    <div class="form-group">
        <label  class="col-sm-2 control-label">违法代码</label>
        <div class="col-sm-10">
            <input type="text"  class="form-control" name="illegalNumber" id="illegalNumber" placeholder="违法代码" readonly="true">
        </div>
    </div>
    <div class="form-group">
        <label  class="col-sm-2 control-label">罚款</label>
        <div class="col-sm-10">
            <input type="text"  class="form-control" name="penalty" id="penalty" placeholder="罚款金额" readonly="true">
        </div>
    </div>
    <div class="form-group">
        <label  class="col-sm-2 control-label">记分</label>
        <div class="col-sm-10">
            <input type="text"  class="form-control" name="score" placeholder="记分" id="score" readonly="true">
        </div>
    </div>
    <div class="form-group">
        <label  class="col-sm-2 control-label">违法地点</label>
        <div class="col-sm-10">
            <input type="text"  class="form-control" name="illegalSite" placeholder="违法地点" id="illegalSite">
        </div>
    </div>
<!--    <div class="form-group">-->
<!--        <label  class="col-sm-2 control-label">状态</label>-->
<!--        <div class="col-sm-10">-->
<!--            <input type="text"  class="form-control" name="state"  value="待处理" readonly="true">-->
<!--        </div>-->
<!--    </div>-->
    <div class="form-group">
        <div class="col-sm-offset-2 col-sm-10">
            <button  type="submit"class="btn btn-primary" >添加</button>
        </div>
    </div>
</form>
</body>
</html>